<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="java.util.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ include file="/WEB-INF/jsp/common/taglib.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>customer_edit</title>
<script src="<c:url value="/ui/jquery-1.10.2.js" />"></script>
<script src="<c:url value="/ui/jquery-migrate-1.2.1.js" />"></script>

<link rel="stylesheet" href="<c:url value="/demo/jquery.ui.all.css"/>">
<link href="<s:url value="/css/standard.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/pop_up.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/maintenance.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/Simplemodal.css" />" rel="stylesheet"
	type="text/css" />

<script src='<c:url value="/js/jquery.DynamicMessage.js" />'></script>
<script src='<c:url value="/js/jquery.simplemodal-1.4.1.js" />'></script>

<script src='<c:url value="/js/common.js" />'></script>
<script src='<c:url value="/js/common_ui.js" />'></script>
<script src='<c:url value="/js/poplayer.js" />'></script>
<script src='<c:url value="/js/maint_ui.js" />'></script>
<script src='<c:url value="/js/jquery.form.js" />'></script>

<script src="<c:url value="/ui/jquery.ui.core.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.widget.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.datepicker.js" />"></script>
<!--  <script src="<c:url value="/ui/jquery-ui-timepicker-addon.js" />"></script>-->

<script src="<c:url value="/ui/jquery-ui-slide.min.js" />"></script>
<link rel="stylesheet" href="<c:url value="/demo/demos.css" />">
<link rel="stylesheet" href="<c:url value="/demo/dateTime.css" />">


</head>
<body>
	<div class="pageVar">
		<c:set var='pageIndex' value='${pageIndex}' />
		<c:set var='pageSize' value="${pageSize}" />
		<c:set var='totalPage' value="${totalPage}" />

		<c:set var='changePercent' value="0.7" />
		<c:set var='changeStepSize' value="1" />


		<c:set var='starPageIndex' value="0" />
		<c:set var='endPageIndex' value="${pageSize}" />
		<c:set var='changeStep' value="0" />

		<c:if test="${pageIndex >= pageSize * changePercent}">
			<c:set var='changeStep'
				value="${
					 ( 
			 			(pageIndex - endPageIndex * changePercent + 1) 
							-
							(pageIndex - endPageIndex * changePercent + 1) %1 ) * changeStepSize}" />
			<!-- 减去自身的余数*增加页数值 -->

		</c:if>

		<c:set var="starPageIndex" value="${starPageIndex+changeStep}"></c:set>

		<c:set var="endPageIndex" value="${endPageIndex+changeStep}"></c:set>

		<c:set var="needEndValue" value="true" />

		<c:if test="${endPageIndex >= totalPage}">
			<c:set var="endPageIndex" value="${totalPage}" />
			<c:set var="needEndValue" value="false" />
		</c:if>


		<c:set var="isShowOmitSign" value="false" />

		<c:if test="${needEndValue}">

			<c:set var="isShowOmitSign" value="${totalPage > (endPageIndex)}" />


		</c:if>

	</div>
	<div class="search">
		<form:form method="get" name="searchForm">
			<table width="100%" border="0" cellspacing="0" cellpadding="0">
				<tr>
					<td height="35px">&nbsp&nbsp 联系人姓名:<input type="text" name="name"
						value="${conditionQuery.name}"> 职务: <input type="text"
						name="duty" value="${conditionQuery.duty}">
						
						<input type="hidden"
						name="cus_id" value="${customer.id}"> 
						 <input
						type='submit' onclick="search('${customer.id }')" value=' 查询 ' />
					</td>
				</tr>
			</table>
		</form:form>
	</div>
	<form:form name="editForm" method="put">

		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			
			<tr>
				<td width="7" align="left" valign="top" height="7"><img
					src="<s:url value="/images/corner_left_top_m.gif"/>" width="7"
					height="7" /></td>
				<td class="topBorderMain"><img
					src="<s:url value="/images/spacer.gif" />" /></td>
				<td width="7" align="right" valign="top"><img
					src="<s:url value="/images/corner_right_top_m.gif" />" /></td>
			</tr>

			<tr>
				<th colspan="4" class="mainFormTitle">客户信息_新增</th>

			</tr>
			<tr>
				<td colspan="4" class="leftRightBorderMain">
					<table id="radiotable" class="mainGrid" width="100%" border="0"
						cellpadding="0" cellspacing="0">
						<thead>
							<tr>

								<th width="17%">公司名称</th>
								<th width="17%">电话</th>
								<th width="17%">地址</th>
								<th width="17%">传真</th>
								<th width="17%">等级</th>
								<th width="17%">区域</th>

							</tr>
						</thead>
						<tbody>
							<tr id="radiotable_tr">
								<td align='center' style="word-break: break-all;"><input
									name="name" value="${customer.name }"><input
									type="hidden" name="id" value="${customer.id }"></td>

								<td align='center' style="word-break: break-all;"><input
									name="tel" value="${customer.tel }"></td>

								<td align='center' style="word-break: break-all;"><input
									name="address" value="${customer.address }"></td>

								<td align='center' style="word-break: break-all;"><input
									name="fax" value="${customer.fax }"></td>

								<td align='center' style="word-break: break-all;"><select
									name='level'>
										<option value="first"
											<c:if test="${customer.level == 'first'}">selected</c:if>>first</option>
										<option value="second"
											<c:if test="${customer.level == 'second'}">selected</c:if>>second</option>
										<option value="third"
											<c:if test="${customer.level == 'third'}">selected</c:if>>third</option>

								</select></td>

								<td align='center' style="word-break: break-all;"><select
									name='district'>
										<option value="South China"
											<c:if test="${customer.district == 'South China'}">selected</c:if>>South
											China</option>
										<option value="North China"
											<c:if test="${customer.district == 'North China'}">selected</c:if>>North
											China</option>
										<option value="West China"
											<c:if test="${customer.district == 'West China'}">selected</c:if>>West
											China</option>
										<option value="East China"
											<c:if test="${customer.district == 'East China'}">selected</c:if>>East
											China</option>
								</select></td>
							</tr>


						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<th colspan="4" class="mainFormbtn" style="height: 15px"></th>

			</tr>
			<tr>
				<td align="left" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_left_bottom_m.gif"/>" /></td>
				<td class="bottomBorderMain"><img
					src="<s:url value="/images/spacer.gif"/>" /></td>
				<td align="right" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_right_bottom_m.gif"/>" /></td>
			</tr>

			<tr height="40px"></tr>
			<tr>
				<td width="7" align="left" valign="top" height="7"><img
					src="<s:url value="/images/corner_left_top_m.gif"/>" width="7"
					height="7" /></td>
				<td class="topBorderMain"><img
					src="<s:url value="/images/spacer.gif" />" /></td>
				<td width="7" align="right" valign="top"><img
					src="<s:url value="/images/corner_right_top_m.gif" />" /></td>
			</tr>
			<tr>

				<th colspan="4" class="mainFormTitle">联系人信息_新增 <br>
				</th>

			</tr>
			<tr>
				<td colspan="5" class="leftRightBorderMain"
					style="border-top-color: black;">
					<table id="radiotable_1" class="mainGrid" width="100%" border="0"
						cellpadding="0" cellspacing="0">
						<thead>
							<tr>
								<th width="17%">姓名</th>
								<th width="17%">地址</th>
								<th width="17%">职务</th>
								<th width="17%">电话</th>
								<th width="17%">邮箱</th>
								<th width="17%">编辑 &nbsp <img
									src="<s:url value="/images/btn_add.gif"/>" name="btn_add.gif"
									align="absbottom" /><a href="javascript:doadd()"
									style="font-size: 15px; text-decoration: none;">添加</a></th>
							</tr>
						</thead>
						<c:forEach items="${list}" var="contact" varStatus="i">
							<tr id="radiotable_tr_${i.index}">

								<td align='center' style="word-break: break-all;"><input
									name="contacts[${i.index }].name" value="${contact.name}"></td>

								<td align='center' style="word-break: break-all;"><input
									name="contacts[${i.index }].address" value="${contact.address}"></td>

								<td align='center' style="word-break: break-all;"><input
									name="contacts[${i.index }].duty" value="${contact.duty}"></td>

								<td align='center' style="word-break: break-all;"><input
									name="contacts[${i.index }].tel" value="${contact.tel}"></td>

								<td align='center' style="word-break: break-all;"><input
									name="contacts[${i.index }].mail" value="${contact.mail}"><input
									name="contacts[${i.index }].id" value="${contact.id}"
									type="hidden"></td>



								<td align='center' style="word-break: break-all;"><input
									type="button"
									onclick="deleteContact('radiotable_tr_${i.index}')"
									value=" delete " class="button"></td>


							</tr>
						</c:forEach>

					</table> <input type="hidden" value="${fn:length(list)-1}" id="length">
				</td>
			</tr>
			<tr>
				<th colspan="4" class="mainFormbtn" style="height: 30px">


					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
							<td align="center">
								<table width="100%" border="0" cellspacing="0" cellpadding="0">
									<tr>
										<td align="center"><div class="pageColumn">
												<table width="100%">
													<td align="center"><form:form action="page"> 
																		页数：【    ${pageIndex+1} 】<a
																style="text-decoration: none;"
																<c:choose>
																
																 <c:when test="${pageIndex > 1}"> 
																href="javascript:goPage('${pageIndex-1}')"
																</c:when>
													
  					             					 			<c:otherwise>
  					             					 				 href="javascript:goPage('0')"
   															</c:otherwise>
   															
   																		</c:choose>>
																【上一页】</a>
															<a
																<c:choose>
																
																 <c:when test="${pageIndex+1 == totalPage}"> 
																href="javascript:goPage('${pageIndex}')"
																</c:when>
													
  					             					 			<c:otherwise>
  					             					 				 href="javascript:goPage('${pageIndex+1}')"
   															</c:otherwise>
   															
   																		</c:choose>
																style="text-decoration: none">【下一页】</a> 
														总页数：${totalPage}  &nbsp 跳转     <input
																style="text-align: center;" size="1" name="amount"
																value="" type="text" id="skip">
															<a
																style="text-decoration: none; font-size: 15px; cursor: pointer;"
																onclick="skip()">确定 </a>
														</form:form></td>

												</table>

											</div></td>
									</tr>
								</table>
							</td>
						</tr>
					</table>

					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
							<td align="center" style="height: 30px">
								<table width="100%" border="0" cellspacing="0" cellpadding="0">
									<tr>
										<td align="center" style="height: 30px"><div
												class="pageColumn">
												<table width="100%">
													<td align="center"><input type="submit"
														value=" Submit " class="button" onclick="doSubmit()" /><input
														type="button" value=" Back " class="button"
														name="blGo2242" onclick="toBack();" /></td>

												</table>



											</div></td>
									</tr>
								</table>
							</td>
						</tr>
					</table>

				</th>

			</tr>
			<tr>
				<td align="left" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_left_bottom_m.gif"/>" /></td>
				<td class="bottomBorderMain"><img
					src="<s:url value="/images/spacer.gif"/>" /></td>
				<td align="right" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_right_bottom_m.gif"/>" /></td>
			</tr>
		</table>
	</form:form>
	<script type="text/javascript">
		function doSubmit() {
			editForm.action = "<c:url value='/customer/edit'/>";
			editForm.submit();
		}
		function toBack() {
			self.location = "<c:url value='/customer/page'/>"
		}

		function doadd() {
			var newlength = Number($("#length").val()) + 1;
			$("#length").val(newlength);

			var text1 = $("<tr></tr>").attr("id", "radiotable_tr_" + newlength);

			var text2 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text3 = $("<input >").attr({
				"name" : "contacts[" + newlength + "].name",
				"class" : newlength
			});

			var text4 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text5 = $("<input >").attr({
				"name" : "contacts[" + newlength + "].address",
				"class" : newlength
			});

			var text6 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text7 = $("<input >").attr({
				"name" : "contacts[" + newlength + "].duty",
				"class" : newlength
			});

			var text8 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text9 = $("<input >").attr({
				"name" : "contacts[" + newlength + "].tel",
				"class" : newlength
			});

			var text10 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text11 = $("<input >").attr({
				"name" : "contacts[" + newlength + "].mail",
				"class" : newlength
			});

			var text12 = $("<td align='center' style='word-break: break-all;' ></td>");
			var text13 = $("<input >").attr(
					{
						"type" : "button",
						"onclick" : "deleteContact( 'radiotable_tr_"
								+ newlength + "')",
						"value" : " delete ",
						"class" : "button"
					});

			text2.append(text3);
			text4.append(text5);
			text6.append(text7);
			text8.append(text9);
			text10.append(text11);
			text12.append(text13);

			text1.append(text2, text4, text6, text8, text10, text12);

			$("#radiotable_1").append(text1);

		}

		function deleteContact(id) {

			$("#" + id).remove();
		}

		function search(id) {
			searchForm.action = "<c:url value='/customer/'/>"+id+"/edit";
			searchForm.submit();
		}
	</script>
</body>
</html>